

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title>EPUB Overview &mdash; Sigil v0.4.1 documentation</title>
    <link rel="stylesheet" href="_static/custom.css" type="text/css" />
    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
    <script type="text/javascript">
      var DOCUMENTATION_OPTIONS = {
        URL_ROOT:    '',
        VERSION:     '0.4.1',
        COLLAPSE_INDEX: false,
        FILE_SUFFIX: '.html',
        HAS_SOURCE:  true
      };
    </script>
    <script type="text/javascript" src="_static/jquery.js"></script>
    <script type="text/javascript" src="_static/underscore.js"></script>
    <script type="text/javascript" src="_static/doctools.js"></script>
    <link rel="shortcut icon" href="_static/app_16.ico"/>
    <link rel="top" title="Sigil v0.4.1 documentation" href="index.html" />
    <link rel="next" title="Glossary" href="glossary.html" />
    <link rel="prev" title="Table of Contents Editor" href="toc_editor.html" />
 
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-6767398-2']);
  _gaq.push(['_trackPageview']);
</script>

  </head>
  <body>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="genindex.html" title="General Index"
             accesskey="I">index</a></li>
        <li class="right" >
          <a href="glossary.html" title="Glossary"
             accesskey="N">next</a> |</li>
        <li class="right" >
          <a href="toc_editor.html" title="Table of Contents Editor"
             accesskey="P">previous</a> |</li>
        <li><a href="contents.html">Sigil v0.4.1 documentation</a> &raquo;</li> 
      </ul>
    </div>
      <div class="sphinxsidebar">
        <div class="sphinxsidebarwrapper">
            <p class="logo"><a href="contents.html">
              <img class="logo" src="_static/small_logo.png" alt="Logo"/>
            </a></p>
  <h3><a href="contents.html">Table Of Contents</a></h3>
  <ul>
<li><a class="reference internal" href="#">EPUB Overview</a><ul>
<li><a class="reference internal" href="#open-publication-structure">Open Publication Structure</a></li>
<li><a class="reference internal" href="#open-packaging-format">Open Packaging Format</a><ul>
<li><a class="reference internal" href="#the-opf-file">The OPF file</a></li>
<li><a class="reference internal" href="#the-ncx-file">The NCX file</a></li>
</ul>
</li>
<li><a class="reference internal" href="#oebps-container-format">OEBPS Container Format</a></li>
</ul>
</li>
</ul>

  <h4>Previous topic</h4>
  <p class="topless"><a href="toc_editor.html"
                        title="previous chapter">Table of Contents Editor</a></p>
  <h4>Next topic</h4>
  <p class="topless"><a href="glossary.html"
                        title="next chapter">Glossary</a></p>
  <h3>This Page</h3>
  <ul class="this-page-menu">
    <li><a href="_sources/epub_overview.txt"
           rel="nofollow">Show Source</a></li>
  </ul>
<div id="searchbox" style="display: none">
  <h3>Quick search</h3>
    <form class="search" action="search.html" method="get">
      <input type="text" name="q" size="18" />
      <input type="submit" value="Go" />
      <input type="hidden" name="check_keywords" value="yes" />
      <input type="hidden" name="area" value="default" />
    </form>
    <p class="searchtip" style="font-size: 90%">
    Enter search terms or a module, class or function name.
    </p>
</div>
<script type="text/javascript">$('#searchbox').show(0);</script>
        </div>
      </div>

    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body">
            
  <div class="section" id="epub-overview">
<span id="id1"></span><h1>EPUB Overview<a class="headerlink" href="#epub-overview" title="Permalink to this headline">¶</a></h1>
<p>The <abbr>EPUB</abbr> format is a standard created by the <em>International Digital Publishing Forum</em> (<abbr>IDPF</abbr>). It consists of three separate specifications:</p>
<ul class="simple">
<li><em>Open Publication Structure</em> (<abbr>OPS</abbr>), which describes how the content is to be presented;</li>
<li><em>Open Packaging Format</em> (<abbr>OPF</abbr>), which describes how the content files and resources are connected into a <em>logical</em> whole, a <em>publication</em>;</li>
<li><em>OEBPS Container Format</em> (<abbr>OCF</abbr>), which describes how the publication is encapsulated in a <abbr>ZIP</abbr> archive.</li>
</ul>
<p>This chapter will provide a brief overview of the format aimed at beginners.</p>
<div class="section" id="open-publication-structure">
<h2>Open Publication Structure<a class="headerlink" href="#open-publication-structure" title="Permalink to this headline">¶</a></h2>
<p>This specification describes what the different content files of the book should look like. The basis of the content files is <a class="reference internal" href="glossary.html#term-xhtml"><em class="xref std std-term">XHTML</em></a> 1.1. An example document follows:</p>
<div class="highlight-html"><div class="highlight"><pre><span class="cp">&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot; ?&gt;</span>
<span class="cp">&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.1//EN&quot;</span>
<span class="cp">    &quot;http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd&quot;&gt;</span>
<span class="nt">&lt;html</span> <span class="na">xmlns=</span><span class="s">&quot;http://www.w3.org/1999/xhtml&quot;</span> <span class="na">xml:lang=</span><span class="s">&quot;en&quot;</span><span class="nt">&gt;</span>
  <span class="nt">&lt;head&gt;</span>
    <span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">type=</span><span class="s">&quot;text/css&quot;</span>
        <span class="na">href=</span><span class="s">&quot;../Styles/stylesheet.css&quot;</span> <span class="nt">/&gt;</span>
  <span class="nt">&lt;/head&gt;</span>
  <span class="nt">&lt;body&gt;</span>
    <span class="nt">&lt;p&gt;</span>This is the first paragraph.
       This is the first paragraph.
       This is the first paragraph.
    <span class="nt">&lt;/p&gt;</span>
    <span class="nt">&lt;p&gt;</span>This is the second paragraph.
       This is the second paragraph.
       This is the second paragraph.
    <span class="nt">&lt;/p&gt;</span>
    <span class="nt">&lt;img</span> <span class="na">src=</span><span class="s">&quot;../Images/example_image.jpg&quot;</span><span class="nt">&gt;</span>
  <span class="nt">&lt;/body&gt;</span>
<span class="nt">&lt;/html&gt;</span>
</pre></div>
</div>
<p>You would see something very similar to this if you switched to <a class="reference internal" href="main_ui.html#code-view"><em>Code View</em></a> in the main Sigil <a class="reference internal" href="glossary.html#term-ui"><em class="xref std std-term">UI</em></a>. Notice the pattern: content is <em>marked up</em> between the start and end <em>tags</em> of an <em>element</em>. This is how <a class="reference internal" href="glossary.html#term-xml"><em class="xref std std-term">XML</em></a> (on which <abbr>XHTML</abbr> is based) works. The <tt class="docutils literal"><span class="pre">&lt;p&gt;</span></tt> element is a good example; it delimits the words and sentences that should be regarded as making up a single paragraph. There are many more elements in <abbr>XHTML</abbr>.</p>
<p>With <abbr>XHTML</abbr>, the user semantically marks up the content of the document and specifies its structure. Usually, a <a class="reference internal" href="glossary.html#term-css"><em class="xref std std-term">CSS</em></a> stylesheet is &#8220;applied&#8221; to the document. In this example, it is linked with the <tt class="docutils literal"><span class="pre">&lt;link&gt;</span></tt> element; this tells any <abbr>XHTML</abbr> renderer to use this stylesheet when rendering the document.</p>
<p>What does the renderer do? It looks at the marked-up document and the linked stylesheets and determines how this content should be displayed on the user&#8217;s screen. The <abbr>XHTML</abbr> document describes <em>what</em> is the content, and the <abbr>CSS</abbr> stylesheet describes <em>how</em> it should be laid out and formatted. <abbr>XHTML</abbr> answers questions like: &#8220;What is a paragraph? What is a list of items? What is a table?&#8221;, and <abbr>CSS</abbr> answers questions like: &#8220;How much should the paragraphs be indented? What color is the text? What fonts should be used? How big is the text?&#8221;.</p>
<p>You create many <abbr>XHTML</abbr> documents <a class="footnote-reference" href="#id3" id="id2">[1]</a> for one <abbr>EPUB</abbr> file. Customarily, you create one per book chapter, but you can do it differently if you want to (but do so only if you have a good reason). For novels, one stylesheet is usually enough and is used in all the <abbr>XHTML</abbr> files.</p>
<p>Now you may be wondering, why should readers of an <abbr>EPUB</abbr> have to jump from one <abbr>XHTML</abbr> file to the next? Why can&#8217;t they just see the book as one text &#8220;flow&#8221;? The answer is that they do. The readers are <em>not</em> aware that an <abbr>EPUB</abbr> file is an archive of several different files since their <a class="reference internal" href="glossary.html#term-reading-system"><em class="xref std std-term">Reading System</em></a> always displays everything in it as one text flow. Even when every chapter is actually a separate file, when the user pages through their book, they see one chapter ending, and on the next page, the next chapter starting. They are <em>never</em> aware that their <em>Reading System</em> has actually transitioned them from one file to the next.</p>
<p>You may be surprised, but Microsoft Word&#8217;s new <abbr>DOCX</abbr> format is also several marked-up files inside a <abbr>ZIP</abbr> archive. And yet you see it as &#8220;one&#8221; document.</p>
</div>
<div class="section" id="open-packaging-format">
<h2>Open Packaging Format<a class="headerlink" href="#open-packaging-format" title="Permalink to this headline">¶</a></h2>
<p>This specification deals with connecting the various <abbr>XHTML</abbr>, <abbr>CSS</abbr>, font and image files into a &#8220;publication&#8221;. It brings in two new <abbr>XML</abbr> files: the <abbr>OPF</abbr> and the <abbr>NCX</abbr>.</p>
<div class="section" id="the-opf-file">
<span id="opf"></span><h3>The OPF file<a class="headerlink" href="#the-opf-file" title="Permalink to this headline">¶</a></h3>
<p>The <abbr>OPF</abbr> file describes several major components:</p>
<ul class="simple">
<li>The metadata — the metadata for the publication;</li>
<li>The manifest — lists all the files that make up the publication;</li>
<li>The spine — provides a linear reading order of the <abbr>XHTML</abbr> files;</li>
<li>The guide — provides a set of references to some of the basic structural elements of the publication, such as a table of contents, foreword, bibliography, etc.</li>
</ul>
<p>Here is an example <abbr>OPF</abbr> file:</p>
<div class="highlight-xml"><div class="highlight"><pre><span class="cp">&lt;?xml version=&quot;1.0&quot;?&gt;</span>
<span class="nt">&lt;package</span> <span class="na">version=</span><span class="s">&quot;2.0&quot;</span>
         <span class="na">xmlns=</span><span class="s">&quot;http://www.idpf.org/2007/opf&quot;</span>
         <span class="na">unique-identifier=</span><span class="s">&quot;BookId&quot;</span> <span class="nt">&gt;</span>

  <span class="nt">&lt;metadata</span> <span class="na">xmlns:dc=</span><span class="s">&quot;http://purl.org/dc/elements/1.1/&quot;</span>
            <span class="na">xmlns:opf=</span><span class="s">&quot;http://www.idpf.org/2007/opf&quot;</span><span class="nt">&gt;</span>
    <span class="nt">&lt;dc:title&gt;</span>Tale of Two Cities<span class="nt">&lt;/dc:title&gt;</span>
    <span class="nt">&lt;dc:creator</span> <span class="na">opf:file-as=</span><span class="s">&quot;Dickens, Charles&quot;</span>
                <span class="na">opf:role=</span><span class="s">&quot;aut&quot;</span><span class="nt">&gt;</span>Charles Dickens<span class="nt">&lt;/dc:creator&gt;</span>
    <span class="nt">&lt;dc:language&gt;</span>en<span class="nt">&lt;/dc:language&gt;</span>
    <span class="nt">&lt;dc:identifier</span> <span class="na">id=</span><span class="s">&quot;BookId&quot;</span> <span class="na">opf:scheme=</span><span class="s">&quot;ISBN&quot;</span><span class="nt">&gt;</span>
        123456789X
    <span class="nt">&lt;/dc:identifier&gt;</span>
  <span class="nt">&lt;/metadata&gt;</span>

  <span class="nt">&lt;manifest&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;ncx&quot;</span>        <span class="na">href=</span><span class="s">&quot;toc.ncx&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;application/x-dtbncx+xml&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;chapter001&quot;</span> <span class="na">href=</span><span class="s">&quot;Text/chapter001.xhtml&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;application/xhtml+xml&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;chapter002&quot;</span> <span class="na">href=</span><span class="s">&quot;Text/chapter002.xhtml&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;application/xhtml+xml&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;loi&quot;</span>        <span class="na">href=</span><span class="s">&quot;Text/loi.xhtml&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;application/xhtml+xml&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;stylesheet&quot;</span> <span class="na">href=</span><span class="s">&quot;Styles/stylesheet.css&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;text/css&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;cover&quot;</span>      <span class="na">href=</span><span class="s">&quot;Images/cover.png&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;image/png&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;item</span> <span class="na">id=</span><span class="s">&quot;caecilia&quot;</span>   <span class="na">href=</span><span class="s">&quot;Fonts/caecilia.otf&quot;</span>
        <span class="na">media-type=</span><span class="s">&quot;application/x-font-opentype&quot;</span><span class="nt">/&gt;</span>
  <span class="nt">&lt;/manifest&gt;</span>

  <span class="nt">&lt;spine</span> <span class="na">toc=</span><span class="s">&quot;ncx&quot;</span><span class="nt">&gt;</span>
    <span class="nt">&lt;itemref</span> <span class="na">idref=</span><span class="s">&quot;chapter001&quot;</span> <span class="nt">/&gt;</span>
    <span class="nt">&lt;itemref</span> <span class="na">idref=</span><span class="s">&quot;chapter002&quot;</span> <span class="nt">/&gt;</span>
  <span class="nt">&lt;/spine&gt;</span>

  <span class="nt">&lt;guide&gt;</span>
    <span class="nt">&lt;reference</span> <span class="na">type=</span><span class="s">&quot;loi&quot;</span> <span class="na">title=</span><span class="s">&quot;List Of Illustrations&quot;</span>
               <span class="na">href=</span><span class="s">&quot;loi.xhtml&quot;</span> <span class="nt">/&gt;</span>
  <span class="nt">&lt;/guide&gt;</span>

<span class="nt">&lt;/package&gt;</span>
</pre></div>
</div>
<p>You can clearly see the <tt class="docutils literal"><span class="pre">metatada</span></tt>, <tt class="docutils literal"><span class="pre">manifest</span></tt>, <tt class="docutils literal"><span class="pre">spine</span></tt> and <tt class="docutils literal"><span class="pre">guide</span></tt> elements and their children. There really is nothing complicated about this, lots of people end up writing all this information by hand. It&#8217;s tedious, but doable. Sigil writes this file automatically for you, and in the future it will provide the user with the means of editing it directly if he wants the extra power that comes with this ability.</p>
</div>
<div class="section" id="the-ncx-file">
<span id="ncx"></span><h3>The NCX file<a class="headerlink" href="#the-ncx-file" title="Permalink to this headline">¶</a></h3>
<p>The other file that every publication needs is the <em>Navigation Center eXtended</em> (<abbr>NCX</abbr>). This file describes the hierarchical Table of Contents (<abbr>TOC</abbr>) for the publication. Here&#8217;s an example:</p>
<div class="highlight-xml"><div class="highlight"><pre><span class="cp">&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;</span>
<span class="cp">&lt;!DOCTYPE ncx PUBLIC &quot;-//NISO//DTD ncx 2005-1//EN&quot;</span>
<span class="cp">&quot;http://www.daisy.org/z3986/2005/ncx-2005-1.dtd&quot;&gt;</span>

<span class="nt">&lt;ncx</span> <span class="na">version=</span><span class="s">&quot;2005-1&quot;</span>
     <span class="na">xml:lang=</span><span class="s">&quot;en&quot;</span>
     <span class="na">xmlns=</span><span class="s">&quot;http://www.daisy.org/z3986/2005/ncx/&quot;</span><span class="nt">&gt;</span>

  <span class="nt">&lt;head&gt;</span>
    <span class="nt">&lt;meta</span> <span class="na">name=</span><span class="s">&quot;dtb:uid&quot;</span> <span class="na">content=</span><span class="s">&quot;123456789X&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;meta</span> <span class="na">name=</span><span class="s">&quot;dtb:depth&quot;</span> <span class="na">content=</span><span class="s">&quot;1&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;meta</span> <span class="na">name=</span><span class="s">&quot;dtb:totalPageCount&quot;</span> <span class="na">content=</span><span class="s">&quot;0&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;meta</span> <span class="na">name=</span><span class="s">&quot;dtb:maxPageNumber&quot;</span> <span class="na">content=</span><span class="s">&quot;0&quot;</span><span class="nt">/&gt;</span>
  <span class="nt">&lt;/head&gt;</span>

  <span class="nt">&lt;docTitle&gt;</span>
    <span class="nt">&lt;text&gt;</span>Tale of Two Cities<span class="nt">&lt;/text&gt;</span>
  <span class="nt">&lt;/docTitle&gt;</span>

  <span class="nt">&lt;docAuthor&gt;</span>
    <span class="nt">&lt;text&gt;</span>Dickens, Charles<span class="nt">&lt;/text&gt;</span>
  <span class="nt">&lt;/docAuthor&gt;</span>

  <span class="nt">&lt;navMap&gt;</span>
    <span class="nt">&lt;navPoint</span> <span class="na">class=</span><span class="s">&quot;chapter&quot;</span> <span class="na">id=</span><span class="s">&quot;chapter001&quot;</span> <span class="na">playOrder=</span><span class="s">&quot;1&quot;</span><span class="nt">&gt;</span>
      <span class="nt">&lt;navLabel&gt;&lt;text&gt;</span>Chapter 1<span class="nt">&lt;/text&gt;&lt;/navLabel&gt;</span>
      <span class="nt">&lt;content</span> <span class="na">src=</span><span class="s">&quot;chapter00l.xhtml&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;/navPoint&gt;</span>

    <span class="nt">&lt;navPoint</span> <span class="na">class=</span><span class="s">&quot;chapter&quot;</span> <span class="na">id=</span><span class="s">&quot;chapter002&quot;</span> <span class="na">playOrder=</span><span class="s">&quot;2&quot;</span><span class="nt">&gt;</span>
      <span class="nt">&lt;navLabel&gt;&lt;text&gt;</span>Chapter 2<span class="nt">&lt;/text&gt;&lt;/navLabel&gt;</span>
      <span class="nt">&lt;content</span> <span class="na">src=</span><span class="s">&quot;chapter002.xhtml&quot;</span><span class="nt">/&gt;</span>
    <span class="nt">&lt;/navPoint&gt;</span>
  <span class="nt">&lt;/navMap&gt;</span>

<span class="nt">&lt;/ncx&gt;</span>
</pre></div>
</div>
<p>The <tt class="docutils literal"><span class="pre">&lt;navPoint&gt;</span></tt> elements point either to whole documents, or to the specific elements within those documents. They can be nested to create a hierarchical <abbr>TOC</abbr>.</p>
<p>Sigil creates this file from the headings present in your <abbr>XHTML</abbr> documents. Every heading is referenced by a <tt class="docutils literal"><span class="pre">navPoint</span></tt>, and headings of different levels interact to create a hierarchy. More details of this behaviour can be found in the <a class="reference internal" href="toc_editor.html#tocbuild"><em>Building the TOC</em></a> section. As with the <abbr>OPF</abbr> file, future versions of Sigil will enable direct editing of this file for those who want it.</p>
<div class="admonition note">
<p class="first admonition-title">Note</p>
<p class="last">If your heading is &#8220;near&#8221; the beginning of your <abbr>XHTML</abbr> file, Sigil will link directly to that file and not to the heading element. This is because on some <em>Reading Systems</em>, linking directly to an element slows down the display of the <abbr>TOC</abbr>.</p>
</div>
</div>
</div>
<div class="section" id="oebps-container-format">
<h2>OEBPS Container Format<a class="headerlink" href="#oebps-container-format" title="Permalink to this headline">¶</a></h2>
<p>The <abbr>OCF</abbr> specification states how the publication should be packaged. Large parts of it deal with things like encryption and alternate renditions of a publication within a single archive, but the main idea to take away is that <abbr>EPUB</abbr> files are basically <abbr>ZIP</abbr> archives of the files comprising the publication. The <a class="reference external" href="http://en.wikipedia.org/wiki/ZIP_(file_format)">ZIP</a> format stores the files using the <a class="reference external" href="http://en.wikipedia.org/wiki/DEFLATE">DEFLATE</a> compression algorithm.</p>
<p><abbr>EPUB</abbr> files also must have a <tt class="docutils literal"><span class="pre">META-INF</span></tt> folder with a <tt class="docutils literal"><span class="pre">container.xml</span></tt> file pointing to the <abbr>OPF</abbr> file of the publication. Sigil takes care of all of this for you.</p>
<table class="docutils footnote" frame="void" id="id3" rules="none">
<colgroup><col class="label" /><col /></colgroup>
<tbody valign="top">
<tr><td class="label"><a class="fn-backref" href="#id2">[1]</a></td><td>In the context of <abbr>EPUB</abbr>, <abbr>XHTML</abbr> documents are often called <abbr>OPS</abbr> documents.</td></tr>
</tbody>
</table>
</div>
</div>


          </div>
        </div>
      </div>
      <div class="clearer"></div>
    </div>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="genindex.html" title="General Index"
             >index</a></li>
        <li class="right" >
          <a href="glossary.html" title="Glossary"
             >next</a> |</li>
        <li class="right" >
          <a href="toc_editor.html" title="Table of Contents Editor"
             >previous</a> |</li>
        <li><a href="contents.html">Sigil v0.4.1 documentation</a> &raquo;</li> 
      </ul>
    </div>

    <div class="footer">
        &copy; Copyright 2009-2011, Strahinja Marković.
      Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> 1.0.7.
    </div>
<script type="text/javascript">
  (function() {
    var ga = document.createElement('script');
    ga.src = ('https:' == document.location.protocol ?
              'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    ga.setAttribute('async', 'true');
    document.documentElement.firstChild.appendChild(ga);
  })();
</script>

  </body>
</html>